﻿<style>
    .panel {
        margin-top: 20px;
    }

        .panel input[type="checkbox"] {
            /*margin-top:10px;
        zoom:150%;*/
            position: relative;
            top: 5px;
            width: 20px;
            height: 20px;
        }

    .datagrid-cell label {
        display: inline-block;
        height: 40px;
        line-height: 40px;
        text-align: center;
    }

    .datagrid-header-row, .datagrid-row {
        height: 40px;
    }

    .tr_bj_color {
        background-color: #ffe48d !important;
    }

    input[type="text"] {
        width: 200px;
    }

    select {
        width: 200px;
    }
</style>
<div class="layui-fluid">

    <div class="layui-row layui-col-space5">
        <div class="layui-col-md6">
            <div class="layui-card">

                <div class="layui-card-header">
                    角色
                </div>
                <form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="department-form" onsubmit="return false">
                    <div class="layui-form-item">
                        <!--<div class="layui-inline">
                            <label class="layui-form-label">角色</label>
                            <div class="layui-input-inline">
                                <input type="text" name="workRole" placeholder="请输入" autocomplete="off" class="layui-input">
                            </div>-->
                        <!--<button class="layui-btn layui-btn-primary" type="button" id="reset">重置</button>-->
                        <!--<button class="layui-btn layuiadmin-btn-list" lay-submit lay-filter="contlist-search">
                                <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                            </button>
                        </div>-->
                    </div>
                </form>

                <div class="layui-card-body">
                    <table id="system-roleRights-table" lay-filter="system-roleRights-table"></table>
                </div>
            </div>
        </div>
        <div class="layui-col-md6">
            <div class="layui-card">

                <div class="layui-card-header">
                    权限
                </div>

                <div class="layui-card-body">
                    <button class="layui-btn layuiadmin-btn-admin layui-btn-default" type="button" onclick="ropenOrClose()" style="margin-bottom: 10px;">展开</button>
                    <a class="layui-btn" onclick="save();" id="save" style="margin-bottom: 10px;">保存</a>

                    <table id="system-rolepeoplepage-table" lay-filter="system-rolepeoplepage-table" title="">
                    </table>
                </div>
            </div>
        </div>

    </div>

</div>
<script src="/Scripts/common.js"></script>
<script>var roleId = "";
    var userId = "";
    var departmentId = "";
    var admin = null;
    var projectNo = "";
    var form = null;
    var reTreeGrid = null;
    var rolepeople = null;
    var rolepeoplepage = null;
    var treeGrid = null;
    layui.use(['jquery', 'reTable', 'reTreeGrid', "treeGrid", "layer", "form"], function () {
        var $ = layui.jquery
            , reTable = layui.reTable
            , reForm = layui.reForm
            , layer = layui.layer
            , table = layui.table;
        form = layui.form;
        admin = layui.admin;
        reTreeGrid = layui.reTreeGrid;
        treeGrid = layui.treeGrid;
        var MemberName = "Work_Type_Name";

        rolepeople = {
            tableId: 'system-roleRights'
            , tableOptions: {
                url: '/Admin/getRolePeopleList'
                , idField: 'ID'
                , treeId: 'ID'
                , treeUpId: 'ParentId'
                , treeShowName: 'Name'
                , isPage: false
                , where: { departmentId: departmentId }
                , cols: [[
                    { type: 'numbers' },
                    { field: 'Name', title: "名称", width: 200 },
                    {
                        field: 'Type', title: "类型", width: 100, templet: function (d) {
                            if (d.Type == 1) {
                                return "角色";
                            }
                            else {
                                return "人员";
                            }
                        }
                    },
                    {
                        title: '操作',
                        align: 'center',
                        width: 100,
                        templet: function (d) {
                            var html = '<a class="layui-btn layui-btn-default layui-btn-xs" lay-event="rights">权限</a>';
                            return html;
                        }
                    }
                ]],
                done: function (res, curr, count) {
                    GetInterfaceButton(); //设置当前页面按钮权限
                }

            }
        }
        reTreeGrid.initTreeGrid(rolepeople);


        LoadPageTree();

        form.on('select(department)', function (data) {
            departmentId = data.value;
            reTreeGrid.tableSearch('system-roleRights', {
                where: { dt: new Date(), departmentId: departmentId }
            });
        });
        treeGrid.on('tool(system-roleRights-table)', function (obj) {
            $(".layui-table-body .layui-table tr").each(function () {
                $(this).removeClass("tr_bj_color");
            });
            obj.tr.addClass('tr_bj_color');
            if (obj.event == "rights") {
                console.log(obj.data);
                if (obj.data.Type == 1) {
                    userId = "";
                    roleId = obj.data.ID;
                } else if (obj.data.Type == 2) {
                    roleId = "";
                    userId = obj.data.ID;
                }
                LoadPageTree();
            }



        });

        form.on('submit(contlist-search)', function (data) {
            var field = data.field;

            reTreeGrid.tableSearch('system-roleRights', {
                where: { dt: new Date(), departmentId: departmentId, workRoleName: field.workRole }
            });


        });


    });

    function LoadPageTree() {
        rolepeoplepage = {
            tableId: 'system-rolepeoplepage'
            , tableOptions: {
                url: '/Admin/getRolePeoplePageList'
                , idField: 'PageID'
                , treeId: 'PageID'
                , treeUpId: 'ParentID'
                , treeShowName: 'PageName'
                , isPage: false
                , where: { "roleId": roleId, "userId": userId }
                , cols: [[
                    { type: 'numbers' },
                    { checkbox: true },
                    { field: 'PageName', title: "名称", width: 200 },
                    {
                        field: 'PageType', title: "类型", width: 100
                    },

                ]]

            }
        }
        reTreeGrid.initTreeGrid(rolepeoplepage);





    }
    function ropenOrClose() {
        var treedata = treeGrid.getDataTreeList('system-rolepeoplepage-table');
        treeGrid.treeOpenAll('system-rolepeoplepage-table', !treedata[0][treeGrid.config.cols.isOpen]);
    }

    function save() {

        if (roleId == "" && userId == "") return layui.view.warn('请选选择角色获取人员');
        var checkData = layui.treeGrid.checkStatus('system-rolepeoplepage-table').data;
        var arr = [];
        var arr1 = [];
        $.each(checkData,
            function (idx, data) {
                //console.log(data);
                if (data.PageType == "Button") {
                    arr1.push({ "RoleID": roleId, "UserID": userId, "ApiId": data.PageID, "ApiName": data.PageName, "Interface": data.PageUrl, "Button": data.PageName_EN });

                } else {
                    arr.push(data.PageID);
                }
            });
        console.log(arr1);

        ajax("/Admin/saveRolePeoplePage", "post", "json", JSON.stringify({ "RoleID": roleId, "UserId": userId, "Roles": arr.join(','), "ButtonAuthority": arr1 }), function (res) {
            layui.view.warn('保存成功！');
        }, "application/json", false)

    }</script>